import { AfterViewInit, ChangeDetectorRef, Component, OnDestroy, OnInit, ViewChild } from '@angular/core';
import { Subscription } from 'rxjs';
import { StudentListComponent } from './container/student-list/student-list.component';
import { LoadingIndicatorService } from './http/loading-indicator.service';


// import { Istudent } from './istudent';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  // template:"<input type='button' value='ok'>",
  styleUrls: ['./app.component.scss']
})
export class AppComponent implements AfterViewInit,OnInit,OnDestroy {

  // 订阅加载提示器，目的每次请求发生时候加载等待提示框
  loading = false;
  private loadingSubscription: Subscription | undefined;
  constructor(private loadingIndicator: LoadingIndicatorService,private cdr: ChangeDetectorRef) {
  
  }
  ngOnInit(): void {
    // HttpInterceptorService --》http请求时候显示隐藏加载指示器--》LoadingIndicatorService loading$ 观察者发出的新值--》
    // 初始化订阅
    // 当 LoadingIndicatorService 的 loading$ 观察者发出一个新的值时，你提供的回调函数会被调用。
    // •回调函数（订阅者）接收一个参数 loading，该参数是 loading$ 观察者发出的新值。
    // •根据 loading 的值，你更新组件中的 loading 属性。
    this.loadingSubscription = this.loadingIndicator.loading$.subscribe(loading => {
      this.loading = loading;
      this.cdr.detectChanges();
    });
  }

  title = 'myApp';
  showdialog = false;

  // selectStudentClick(selectStudent:Istudent){
  //   console.log(selectStudent);
  //   this.dialogshow(true);
  // }
  dialogshow(value: boolean) {
    this.showdialog = value;
    // alert(this.showdialog);
  }

  // <!-- Angular中的ViewChild -->
  //  @ViewChild(StudentListComponent,{static:true}) studentListComponent:StudentListComponent|undefined=undefined;
  // @ViewChild("studentlist",{static:true}) studentListComponent:StudentListComponent|undefined=undefined;
  // Angular提供了几个生命周期钩子来帮助你管理组件的生命周期。
  // 对于@ViewChild，重要的是理解ngAfterViewInit和ngAfterContentInit这两个钩子。
  // •ngAfterViewInit：这个钩子在组件视图及其子视图（如果有）初始化完成后被调用。
  // 此时，所有通过@ViewChild或@ViewChildren装饰器访问的元素和子组件都已准备好使用。
  // •ngAfterContentInit：这个钩子在组件的内容投影初始化后被调用。
  // 如果你的@ViewChild引用的是内容子树的一部分，那么你应该在这个钩子中访问它。
  ngAfterViewInit() {
    // 确保视图初始化完成后才访问子元素
    // console.log(this.studentListComponent!.selectStudent);
  }
  ngOnDestroy(): void {
    this.loadingSubscription?.unsubscribe(); // 清理订阅
  }

}
